    header {
        width: 100%;
        height: 60px;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 999;
    }
    
    header .wrapper {
        height: 60px;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    header .logo {
        width: 60px;
        font-size: 30PX;
        text-align: center;
        color: white;
        letter-spacing: 2px;
    }
    
    header #menu {
        height: 60px;
        display: flex;
        justify-content: space-around;
        z-index: 3;
    }
    
    header #menu li {
        width: 70px;
        height: 60px;
        border: 1px solid white;
        text-align: center;
        line-height: 60px;
    }
    
    header #menu li a {
        color: #fff;
        font-size: 16px;
        z-index: 2;
    }
    
    header #menu li:hover {
        cursor: pointer;
    }
    
    header #menu li:hover a {
        color: #000;
        z-index: 999;
        display: block;
    }
    
    header #menu li:hover #nav-content-menubox {
        top: -65px;
    }
    /* header .nav { 
        width: 1200px;
        height: 300px;
        background-color: #fff;
        z-index: 2;
        position: relative;
        top: -365px;
      
        transition: top 0.5s;
    }
    
    header .nav-one {
        width: 1200px;
        height: 140px;
        margin: 0 auto;
        position: absolute;
        display: flex;
        justify-content: space-around;
        align-items: center;
        top: 117px;
        z-index: 100;
    }
    
    .nav-one .nav-one-con {
        width: 120px;
        height: 100px;
    }*/
    
    #nav-content-menubox>li>ul>li p {
        width: 100%;
        height: 100%;
    }
    
    #nav-content-menubox>li>ul>li p img {
        width: 100%;
        height: 100%;
    }
    
    #nav-content-menubox>li>ul>li>i,
    #nav-content-menubox>li>ul>li>span {
        height: 25px;
        line-height: 25px;
        font-size: 12px;
        color: #666;
        text-align: center;
        display: block;
    }
    
    #nav-content-menubox {
        position: absolute;
        top: 0px;
        width: 100%;
        height: 300px;
        background-color: #fff;
        border-top: 1px solid #dbdbdb;
        z-index: 666;
    }
    
    #nav-content-menubox>li {
        /* background-color: red; */
    }
    
    #nav-content-menubox>li>ul {
        list-style: none;
        width: 100%;
        height: 120px;
        /* width: 900px; 
        height: 100%;  */
        margin: 0 auto;
        display: flex;
        justify-content: space-around;
        align-items: flex-start;
        position: absolute;
        top: 120px;
    }
    
    #nav-content-menubox>li>ul>li {
        width: 120px;
        height: 100px;
        /* flex: 1; */
        /* border: 1px solid black; */
        margin-top: 20px;
    }
    /*  #nav-content-menubox>li>ul>li>ul>li{
        list-style: none;
        height: 40px;
        line-height: 40px;
    } */
    
    header input {
        border-radius: 17px;
        width: 150px;
        height: 35px;
        border: 0;
    }
    
    header .header-img {
        width: 70px;
        height: 30px;
        position: relative;
    }
    
    .header-img .icon-fangdajing {
        font-size: 18px;
        position: absolute;
        left: -90px;
        top: 7px;
    }
    
    .header-img .icon-denglu {
        position: absolute;
        top: 0;
        right: 72px;
        color: #fff;
        font-weight: 500;
        font-size: 25px;
    }
    
    .icon-denglu .deng {
        width: 90px;
        height: 170px;
        background-color: #fff;
        text-align: center;
        border-radius: 5px;
        position: absolute;
        left: -30px;
        top: 40px;
        padding-top: 5px;
        display: none;
    }
    
    .icon-denglu .icon-denglu:hover .deng {
        display: block;
    }
    
    .header-img .deng li {
        font-size: 12px;
        margin: 0 auto;
    }
    
    .header-img .deng li a {
        color: #515151;
        text-decoration: none;
    }
    
    .header-img .deng li a:hover {
        color: #008cff;
    }
    
    .header-img .icon-gouwuche {
        font-size: 30px;
        position: absolute;
        top: 0;
        right: 28px;
        color: #fff;
    }
    
    #banner {
        width: 100%;
        height: 600px;
        border: 1px solid black;
        position: relative;
        /* top: -60px; */
    }
    /* .banner img {
    width: 100%;
    height: 100%;
} */
    
    main .main1 {
        height: 210px;
        width: 100%;
        display: flex;
        justify-content: space-evenly;
        /* align-items: center;   */
    }
    
    main .main1 #main1-con {
        width: 310px;
        /* height: 150px;  */
        text-align: center;
    }
    
    main .main1 #main1-con:hover {
        opacity: 0.8;
    }
    
    main .main1 img {
        width: 120px;
        height: 120px;
        margin: auto;
    }
    
    #main1-con h3 {
        font-size: 20px;
        color: #333;
    }
    
    #main1-con span {
        font-size: 14px;
        color: #666;
        text-align: center;
    }
    
    main .main2 {
        width: 100%;
        height: 400px;
        background-color: #ddd;
    }
    
    main .main2 h2 {
        height: 80px;
        line-height: 80px;
        text-align: center;
        margin: 10px 0 10px 0;
    }
    
    main .main2 img {
        width: 100%;
        height: 310px;
    }
    
    main .main2 img:hover {
        opacity: 0.8;
    }
    
    main .main3 {
        width: 100%;
        height: 1150px;
        background-color: #ddd;
        position: relative;
    }
    
    main .main3 .wrapper {
        /*  margin-top: 100px; */
        display: flex;
        justify-content: space-evenly;
        flex-wrap: wrap;
    }
    
    .main3 .main3-big {
        width: 600px;
        height: 650px;
        position: relative;
        margin: 10px 10px 10px 0;
        position: relative;
        top: 0;
        transition: all 0.3s;
        background-color: #fff;
    }
    
    .main3 .main3-big p {
        width: 600px;
        height: 550px;
        position: absolute;
        top: 100px;
        background-color: #ddd;
    }
    
    .main3 .main3-big:hover {
        top: -2px;
        box-shadow: 5px rgba(0, 0, 0, 0.2);
        opacity: 0.8;
    }
    
    .main3 .main3-big img {
        width: 100%;
        height: 100%;
    }
    
    .main3-big strong {
        position: absolute;
        top: 30px;
        left: 30px;
        display: block;
        width: 60px;
        height: 60px;
        line-height: 60px;
        color: #fff;
        font-size: 16px;
        text-align: center;
        border-radius: 50%;
        background-image: linear-gradient( 120deg, #ff3149, #ff64a6);
    }
    
    .main3-big .main3-text {
        width: 600px;
        height: 100px;
        position: absolute;
        top: 20px;
        text-align: center;
        display: block;
        line-height: 32px;
    }
    
    .main3-big h4 {
        color: #333;
        font-size: 28px;
        margin-bottom: 0;
        display: block;
        font-weight: 500;
    }
    
    .main3-big span {
        display: block;
        font-size: 18px;
    }
    
    .main3-big b {
        display: block;
        font-size: 18px;
        color: red;
    }
    
    .main3 .main3-small,
    .main4 .main4-small,
    .main5 .main5-small,
    .main6 .main6-small,
    .main7 .main7-small {
        width: 298px;
        height: 450px;
        position: relative;
        margin: 10px 10px 10px 0;
        top: 0;
        transition: all 0.3s;
        background-color: #fff;
    }
    
    .main3 .main3-small p,
    .main4 .main4-small p,
    .main5 .main5-small p,
    .main6 .main6-small p,
    .main7 .main7-small p {
        width: 298px;
        height: 300px;
        position: absolute;
        top: 30px;
        background-color: #fff;
    }
    
    .main3 .main3-small:hover,
    .main4 .main4-small:hover,
    .main5 .main5-small:hover,
    .main6 .main6-small:hover,
    .main7 .main7-small:hover {
        top: -2px;
        box-shadow: 5px rgba(0, 0, 0, 0.2);
        opacity: 0.8;
    }
    
    .main3 .main3-small img,
    .main4 .main4-small img,
    .main5 .main5-small img,
    .main6 .main6-small img,
    .main7 .main7-small img {
        width: 100%;
        height: 100%;
    }
    
    .main3-small .main3-text,
    .main4-small .main4-text,
    .main5-small .main5-text,
    .main6-small .main6-text,
    .main7-small .main7-text {
        width: 298px;
        height: 100px;
        position: absolute;
        bottom: 20px;
        text-align: center;
        display: block;
        line-height: 32px;
    }
    
    .main3-small h4,
    .main4-small h4,
    .main5-small h4,
    .main6-small h4,
    .main7-small h4 {
        color: #666;
        font-size: 20px;
        margin-bottom: 0;
        display: block;
        font-weight: 500;
    }
    
    .main3-small span,
    .main4-small span,
    .main5-small span,
    .main6-small span,
    .main7-small span {
        color: #888;
        display: block;
        font-size: 14px;
    }
    
    .main3-small b,
    .main4-small b,
    .main5-small b,
    .main6-small b,
    .main7-small b {
        display: block;
        font-size: 14px;
        color: red;
    }
    
    .main3-small strong,
    .main4-small strong,
    .main5-small strong,
    .main6-small strong,
    .main7-small strong {
        position: absolute;
        top: 15px;
        left: 15px;
        display: block;
        width: 60px;
        height: 60px;
        line-height: 60px;
        color: #fff;
        font-size: 16px;
        text-align: center;
        border-radius: 50%;
        background-image: linear-gradient( 120deg, #ff3149, #ff64a6);
    }
    
    main .main4 {
        width: 100%;
        height: 1480px;
        background-color: #ddd;
        position: relative;
    }
    
    main .main4 .wrapper {
        /*  margin-top: 100px; */
        display: flex;
        justify-content: space-evenly;
        flex-wrap: wrap;
        position: relative;
        top: 532px;
    }
    
    .main4 .main4-h3 {
        width: 100%;
        height: 100px;
        color: #666;
        font-size: 28px;
        position: absolute;
        top: 10px;
        font-weight: 500;
        text-align: center;
    }
    
    .main4 .main4-img {
        width: 100%;
        height: 420px;
        position: absolute;
        top: 100px;
    }
    
    .main4 .main4-img:hover {
        opacity: 0.8;
        transition: 2s;
    }
    
    .main4 .main4-img img {
        width: 100%;
        height: 100%;
    }
    
    .main4-class {
        background: url(../img/m4-1.jpg) no-repeat;
        background-size: 298px 450px;
    }
    
    .main4-five {
        background: url(../img/m4-5.jpg) no-repeat;
        background-size: 298px 450px;
    }
    
    main .main5 {
        width: 100%;
        height: 1480px;
        background-color: #ddd;
        position: relative;
    }
    
    main .main5 .wrapper {
        /*  margin-top: 100px; */
        display: flex;
        justify-content: space-evenly;
        flex-wrap: wrap;
        position: relative;
        top: 532px;
    }
    
    .main5 .main5-h3 {
        width: 100%;
        height: 100px;
        color: #666;
        font-size: 28px;
        position: absolute;
        top: 10px;
        font-weight: 500;
        text-align: center;
    }
    
    .main5 .main5-img {
        width: 100%;
        height: 420px;
        position: absolute;
        top: 100px;
    }
    
    .main5 .main5-img:hover {
        opacity: 0.8;
        transition: 2s;
    }
    
    .main5 .main5-img img {
        width: 100%;
        height: 100%;
    }
    
    .main5-class {
        background: url(../img/m5-1.jpg) no-repeat;
        background-size: 298px 450px;
    }
    
    .main5-five {
        background: url(../img/m5-5.jpg) no-repeat;
        background-size: 298px 450px;
    }
    
    main .main6 {
        width: 100%;
        height: 1960px;
        background-color: #ddd;
        position: relative;
    }
    
    main .main6 .wrapper {
        /*  margin-top: 100px; */
        display: flex;
        justify-content: space-evenly;
        flex-wrap: wrap;
        position: relative;
        top: 532px;
    }
    
    .main6 .main6-h3 {
        width: 100%;
        height: 100px;
        color: #666;
        font-size: 28px;
        position: absolute;
        top: 10px;
        font-weight: 500;
        text-align: center;
    }
    
    .main6 .main6-img {
        width: 100%;
        height: 420px;
        position: absolute;
        top: 100px;
    }
    
    .main6 .main6-img:hover {
        opacity: 0.8;
        transition: 2s;
    }
    
    .main6 .main6-img img {
        width: 100%;
        height: 100%;
    }
    
    .main6-class {
        background: url(../img/m6-1.jpg) no-repeat;
        background-size: 298px 450px;
    }
    
    .main6-five {
        background: url(../img/m6-5.jpg) no-repeat;
        background-size: 298px 450px;
    }
    
    .main6-nine {
        background: url(../img/m6-9.jpg) no-repeat;
        background-size: 298px 450px;
    }
    
    main .main7 {
        width: 100%;
        height: 1020px;
        background-color: #ddd;
        position: relative;
    }
    
    main .main7 .wrapper {
        /*  margin-top: 100px; */
        display: flex;
        justify-content: space-evenly;
        flex-wrap: wrap;
        position: relative;
        top: 532px;
    }
    
    .main7 .main7-h3 {
        width: 100%;
        height: 100px;
        color: #666;
        font-size: 28px;
        position: absolute;
        top: 10px;
        font-weight: 500;
        text-align: center;
    }
    
    .main7 .main7-img {
        width: 100%;
        height: 420px;
        position: absolute;
        top: 100px;
    }
    
    .main7 .main7-img:hover {
        opacity: 0.8;
        transition: 2s;
    }
    
    .main7 .main7-img img {
        width: 100%;
        height: 100%;
    }
    
    .main7-class {
        background: url(../img/m7-1.jpg) no-repeat;
        background-size: 298px 450px;
    }
    
    footer {
        width: 100%;
        height: 260px;
        background-color: #fff;
    }
    
    footer .wrapper {
        height: 260px;
    }
    
    .footer-top {
        width: 100%;
        height: 160px;
        position: relative;
    }
    
    .footer-top-right {
        width: 170px;
        height: 120px;
        position: absolute;
        top: 15px;
        right: 15px;
        padding-top: 18px;
    }
    
    .footer-top ul {
        width: 1000px;
        height: 120px;
        position: absolute;
        top: 35px;
        display: flex;
        justify-content: space-evenly;
    }
    
    ul li img {
        margin: auto;
        width: 50px;
        height: 45px;
        display: block;
    }
    
    ul li a {
        display: inline-block;
        text-align: center;
        color: #aaa;
        font-size: 12px;
    }
    
    footer em {
        font-size: 12px;
        color: #aaa;
        text-align: center;
    }
    
    h5 {
        color: #008cff;
        font-size: 23px;
        font-weight: 400;
        margin-top: 6px;
        line-height: 40px;
    }
    
    footer input {
        width: 55px;
        height: 23px;
        padding: 0 16px;
        overflow: hidden;
        position: relative;
        text-align: center;
        line-height: 23px;
        color: #fff;
        border-radius: 15px;
        margin-top: 3px;
        display: inline-block;
        font-size: 14px;
        background: #008cff;
        border: 0;
    }
    
    hr {
        font-weight: 500;
        color: #ccc;
    }
    
    .footer-bottom-left {
        width: 100%;
        height: 30px;
    }
    
    .footer-bottom-left a {
        font-size: 12px;
        color: #aaa;
    }
    
    .footer-bottom-left span {
        font-size: 12px;
        color: #aaa;
    }
    
    footer p {
        font-size: 12px;
        color: #aaa;
        height: 30px;
    }
    
    .footer-bottom {
        width: 100%;
        height: 60px;
        position: relative;
    }
    
    .footer-bottom-right {
        width: 170px;
        height: 60px;
        position: absolute;
        top: 15px;
        right: 15px;
        padding-top: 18px;
        display: flex;
        justify-content: space-between;
    }
    
    .footer-bottom img {
        width: 20px;
    }
    
    #xiaoTuBiao {
        width: 300px;
        position: relative;
        left: 786px;
        top: -20px;
    }
    
    #xiaoTuBiao img:nth-child(2) {
        margin: 0 20px 0 20px;
    }
    
    .footer-bottom span {
        font-size: 12px;
        color: #aaa;
    }